<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel='stylesheet' href="../css/index.css">
	
	<script type="text/javascript" src="../../index/js/libs/jquery.js"></script>
		<script type="text/javascript" src="../js/plugins/niceScroll/js/jquery.nicescroll.js"></script>
	<script type="text/javascript" src="../js/plugins/pagination/default-style/js/jquery.pagination.js"></script>
	<script type="text/javascript" src="../js/plugins/pagination/default-style/js/jquery.pagination.extend.js"></script>
	<script type="text/javascript" src="../js/view/table.js"></script>
	
	<script type="text/javascript" src="../js/view/v-log.js"></script>
		<script type="text/javascript" src="../js/view/function.js"></script>

	<script type="text/javascript">
		$(function(){
	var initPagination = function() {
		var total_page = $("#hiddenresult div.result").length;
		// 创建分页
		$("#pagination").pagination(total_page,{
			callback: page_callback,
			items_per_page : 1,				
			prev_text:"上一页",
			next_text:"下一页",
			num_edge_entries : 5,			//边缘值
			// ellipse_text : '...',			//边缘显示
			num_display_entries : 5	,		//显示条数
			link_to : 'javascript:void(0)'
			
		});
	 }();
	 
	 function page_callback(page_index, jq){
		var new_content = $("#hiddenresult div.result:eq("+page_index+")").clone();
		//$("#Searchresult").empty().append(new_content); //装载对应分页的内容
		return false;
	}
	$('.sel').selectBox({"text":"选择操作类型","ele":$(".sel")});
	$('.stat').selectBox({"text":"","ele":$(".stat")});
})
	</script>
</head>
<body>
	<div class='table po-ab colortext'>		
			<!-- <div class="header tr"></div> -->
			<div class="tr pb-10 pt-10 h-34 border-b pl-15 pr-15 po-re searchNav">
				<div class="po-ab searchList">
					<div class="td input lh-34 pl-10 w160 bordere4edf0"><input class="searchInput" type="text" placeholder="计算机名称"></div>
					<!-- <div class="td ml-10 input lh-34 pl-10 w160 bordere4edf0"><input class="searchInput w70" type="text" placeholder="选择操作类型"> -->
					<div class="td bo-ra-5 w140 bordere4edf0 pl-10 bgwhite color344c50 sel sh cu-p ml-10 po-ab" style="line-height: 0;left:170px">
						<ul>
							<li class="h34 lh-34 selectArrow bgst pm colora9a9a9" style="background-position: 110px 10px">选择操作类型</li>		
							<li class="h34 lh-34 di-n">win7</li>		
							<li class="h34 lh-34 di-n">xp</li>	
						</ul>
					</div>
					<div class="td ml-10 lh-34 pullmore" style="margin-left:170px"></div>
					<div class="td ml-10 search"></div>
					<div class="td ml-10 writing di-n"></div>
				</div>
				<div class="searchPanel po-ab pb-20 di-n">				
					<div class="w-90" style="margin-top:30px;">
						<div class="w100 mr-10 f-l t-a-r h34 lh-34">选择状态</div>
						<div class="td bo-ra-5 w340 bordere4edf0 pl-10 bgwhite color344c50 stat sh cu-p ml-10 po-ab" style="line-height: 0;left:100px">
						<ul>
							<li class="h34 lh-34 selectArrow bgst pm colora9a9a9" style="background-position: 310px 10px"></li>		
							<li class="h34 lh-34 di-n">win7</li>		
							<li class="h34 lh-34 di-n">xp</li>	
						</ul>
					</div>
						<div class="h20 w-90 f-l"></div>
						
						<div class="w100 mr-10 f-l t-a-r h34 lh-34">日期范围</div>
						<div class="f-l w340 input h34 lh-34 pl-10 bordere4edf0"><input type="text" class="searchInput"></div>
						<div class="h20 w-90 f-l"></div>
						<div class="search-btn f-r"></div>
					</div>
				</div>
			</div>
			<div class="tr mt-16 mb-5">
				<div class="tableframe">
					<div class="tableFrameTr head">
						<div class="f-l border-r" style="width:5%;">
							<div class="td ml-20">序号</div>
						</div>
						<div class="f-l border-r pl-5" style="width:15%;">用户名</div>
						<div class="f-l border-r pl-5" style="width:15%">时间</div>
						<div class="f-l border-r pl-5 po-re" style="width:10%;">&nbsp;
							<div class="po-ab bgwhite pl-5 doType" style="left:0;right:5px;top:-16px;">
								<ul>
									<li class="pm bgst" style="padding-top:16px;background-position: 90% 25px">操作类型</li>
								</ul>
								<ul class="pl-10 di-n colortext">
									<li>新增</li>
									<li>编辑</li>
									<li>查询</li>
									<li>其他</li>
								</ul>
							</div>
						</div>
						<div class="f-l pl-5" style="width:15%;">操作对象</div>		
						<div class="f-l pl-5" style="width:20%;">操作详情</div>	
						<div class="f-l" style="width:10%;">操作状态</div>			
					</div>
				</div>
					<div class="overHidden">
						<div class="tableframe">
							<div class="tableFrameTr">
								<div class="f-l" style="width:5%;">
									<div class="td ml-20">1</div>
								</div>
								<div class="f-l pl-6" style="width:15%;">是颠覆瑟尔</div>
								<div class="f-l pl-6" style="width:15%">2016-04-15 16:55:13</div>
								<div class="f-l pl-6" style="width:10%;">新增</div>
								<div class="f-l pl-6" style="width:15%;">虚拟机</div>		
								<div class="f-l pl-6" style="width:20%;">创建虚拟机(研发专用)</div>	
								<div class="f-l" style="width:10%;margin-top:6px;"><div class="success">成功</div></div>	
							</div>
					</div>	
				</div>		
		
		<div class="tableFooter pl-15 pr-15 color6787ab">
			<div class="td">
				<span class="dis-in mr-10 f-l">每页显示</span>
				<div class="w38 mr-10 po-re f-l">
					<div class="po-ab pageBorder" style="vertical-align:top;height:32px;width:30px;top:-5px">
						<span class="di-b">20</li>		
						<span class="di-b">10</li>				
					</div>
					
				</div><div class="f-l" style="margin-left: 50px;">条</div>
			</div>
			<div id="pagination"></div>
			<div class="page f-r h-40 lh-40">
				<div class="td mr-10"><img src='../image/table/pagefirst-disable.png'></div>
				<div class="td mr-10"><img src='../image/table/pageprv-disable.png'></div>
				<div class="td mr-10"><a href="#" class='pageAct'>1</a></div>
				<div class="td mr-10"><a href="#">2</a></div>
				<div class="td mr-10"><a href="#">3</a></div>
				<div class="td mr-10"><a href="#"><a href="#">4</a></div>
				<div class="td mr-10"><a href="#">5</a></div>
				<div class="td mr-10"><img src='../image/table/pagenext.png'></div>
				<div class="td mr-10"><img src='../image/table/pagelast.png'></div>
				<div class="td mr-10" style="width:40px;">跳转到</div>
				<div class="td pageBorder" style="width:35px;height: 26px;margin-top: 7px;"><input type="text" style="width: 35px;height:26px;"></div>
				<div class="td pageBorder t-a-c mr-10" style="width:25px;height:26px;line-height:26px;margin-top: 7px;background-image:none;margin-left:-1px;">GO</div>
				<div class="td" style="width: 80px;">共<label class="color0099ff">
				50</label>条数据</div>
			</div>
		</div>
		
	
</body>
</html> 